<template>
	<scroll-view
		scroll-y
		:style="'height:calc(100vh - '+(StatusBarRpx+88)+'rpx);padding: 0 32rpx;box-sizing: border-box;'"
		:scroll-top="cScroll"
		@scrolltoupper="getMore"
	>
		<view class="in_content">
			<!--
				@scrolltoupper="getMore"
				:scroll-into-view="scrollDomId"
				:scroll-top="cScroll"
				scroll-with-animation
			-->
			<view style="padding: 32rpx 0 0;display: flex;align-items: center;justify-content: center;">
				<slot name="top_other" />
			<!-- 	<u-loading
					v-if="getMoreLoading"
					mode="circle"
					color="#ffffff"
				/> -->
			</view>
			<slot />
			<!-- <view
				class="item_box"
				v-for="(item,index) in list"
				:key="index"
				:id="'m'+(list.length - index)"
			>
				<slot
					:item="item"
					:index="index"
				/>
			</view> -->
			<slot name="other" />
		</view>
	</scroll-view>
</template>

<script>
	/**
	 * @property {Array} list 消息列表
	 * @property {Boolean} getMoreLoading 获取历史消息loading【使用.sync进行改变】
	 * @event {Function()} getMore 获取历史消息
	 * @event {Function()} toScrollTDom 滚动到制定消息【组件方法】
	 */
	export default {
		props: {
			list: {
				type: Array,
				default () { return [] }
			},
			getMoreLoading: Boolean,
		},
		data() {
			return {
				scrollDomId: "",
				cScroll: 0,
				// 偏移距离
				offsetHeight: uni.getSystemInfoSync().windowHeight * 0.6,
				scrollTimer: null,
				moreBeForeScroll: 0,
			}
		},
		created() {

		},
		methods: {
			/** 特殊复制 */
			ccopyFn(event) {
				const str = event.currentTarget.dataset.type.answer || "";
				uni.setClipboardData({ data: str.replace(/<br\/>/g, '') })
			},
			/** 向上偏移 */
			offsetTop() { this.cScroll = 0 },
			/** 向下偏移 */
			offsetetBttom() {
				clearTimeout(this.scrollTimer)
				this.scrollTimer = setTimeout(() => {
					this.cScroll = 100000000 + parseInt(Math.random() * 10)
				}, 100)
			},
			/** 滚动到加载更多数据之前 */
			scrollToBeforeMore() {
				this.$nextTick(() => {
					uni.createSelectorQuery().select(".in_content").boundingClientRect(res => {
						var cHeight = res.height;
						this.cScroll = cHeight - this.moreBeForeScroll - 100;
					}).exec();
				})
			},
			/** 获取更多数据 */
			getMore() {
				uni.createSelectorQuery().select(".in_content").boundingClientRect(res => {
					this.moreBeForeScroll = res.height;
				}).exec();
				this.$emit('getMore');
			},
			toScrollTDom(num = 1) {
				this.$nextTick(() => {
					this.scrollDomId = `m${num}`;
					this.$nextTick(() => this.scrollDomId = "")
				})
			},
		}
	}
</script>
